<!DOCTYPE html>
<html lang="zh-CN">





<head>
  <meta charset="UTF-8">
  <link rel="apple-touch-icon" sizes="76x76" href="/img/apple-touch-icon.jpg">
  <link rel="icon" type="image/png" href="/img/favicon.jpg">
  <meta name="viewport"
        content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no, shrink-to-fit=no">
  <meta http-equiv="x-ua-compatible" content="ie=edge">
  
  <meta name="theme-color" content="#2f4154">
  <meta name="description" content="前端学习交流">
  <meta name="author" content="小侯爷">
  <meta name="keywords" content="">
  <title>Hexo深坑之旅（1）- win7系统下安装hexo - 小侯爷的前端画室</title>

  <link  rel="stylesheet" href="https://cdn.staticfile.org/twitter-bootstrap/4.4.1/css/bootstrap.min.css" />
<link  rel="stylesheet" href="https://cdn.staticfile.org/github-markdown-css/4.0.0/github-markdown.min.css" />


  <link  rel="stylesheet" href="https://cdn.staticfile.org/highlight.js/10.0.0/styles/vs2015.min.css" />


<!-- 主题依赖的图标库，不要自行修改 -->

<link rel="stylesheet" href="//at.alicdn.com/t/font_1749284_fmb4a04yx8h.css">



<link rel="stylesheet" href="//at.alicdn.com/t/font_1736178_pjno9b9zyxs.css">




<link  rel="stylesheet" href="/css/main.css" />

<!-- 自定义样式保持在最底部 -->

  
<link rel="stylesheet" href="/css/dark.css">



  <script>
  var _hmt = _hmt || [];
  (function() {
    var hm = document.createElement("script");
    hm.src = "https://hm.baidu.com/hm.js?838b8f18434ba2e0a7cf1855bd16fc57";
    var s = document.getElementsByTagName("script")[0]; 
    s.parentNode.insertBefore(hm, s);
  })();
  </script>
<meta name="generator" content="Hexo 4.2.1"></head>


<body>
  <div id="dark" onclick="switchDarkMode()"></div>
  <script>
    var isNight = new Date().getHours() >= 22 || new Date().getHours() < 7; // 指定时间
    // 依次判断 系统暗黑模式 指定时间 缓存 dark
    if( matchMedia('(prefers-color-scheme: dark)').matches || isNight || localStorage.getItem('dark') === '1') {
      if(!(isNight&&localStorage.getItem('noDark') === '1')) {
        document.body.classList.add('dark');
      }
    }
    let sun = '<img class="dark-img" src="https://frontend-studio-1256354221.file.myqcloud.com/img/sun.png" srcset="/img/loading.gif">';
    let moon = '<img class="dark-img" src="https://frontend-studio-1256354221.file.myqcloud.com/img/moon.png" srcset="/img/loading.gif">'
    document.getElementById('dark').innerHTML = document.querySelector("body").classList.contains("dark")?moon:sun;
    //点击事件
    function switchDarkMode() {
    	if ($('body').hasClass('dark')) {
        $("#dark").html("<img class='dark-img' src='https://frontend-studio-1256354221.file.myqcloud.com/img/sun.png'>");
    		document.body.classList.remove('dark');
    		localStorage.setItem('noDark', '1');
    		localStorage.setItem('dark', '0');
    	} else {
        $("#dark").html("<img class='dark-img' src='https://frontend-studio-1256354221.file.myqcloud.com/img/moon.png'>");
    		document.body.classList.add('dark');
    		localStorage.setItem('dark', '1');
    		localStorage.setItem('noDark', '0');
    	}
    }
  </script>
  <header style="height: 70vh;">
    <nav id="navbar" class="navbar fixed-top  navbar-expand-lg navbar-dark scrolling-navbar">
  <div class="container">
    <a class="navbar-brand"
       href="/">&nbsp;<strong>小侯爷的前端画室</strong>&nbsp;</a>

    <button id="navbar-toggler-btn" class="navbar-toggler" type="button" data-toggle="collapse"
            data-target="#navbarSupportedContent"
            aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
      <div class="animated-icon"><span></span><span></span><span></span></div>
    </button>

    <!-- Collapsible content -->
    <div class="collapse navbar-collapse" id="navbarSupportedContent">
      <ul class="navbar-nav ml-auto text-center">
        
          
          
          
          <li class="nav-item">
            <a class="nav-link" href="/index/">
              <i class="iconfont icon-home-fill"></i>
              首页</a>
          </li>
        
          
          
          
          <li class="nav-item">
            <a class="nav-link" href="/game/">
              <i class="iconfont icon-switch-fill"></i>
              游戏堂</a>
          </li>
        
          
          
          
          <li class="nav-item">
            <a class="nav-link" href="/photo/">
              <i class="iconfont icon-images"></i>
              相册集</a>
          </li>
        
          
          
          
          <li class="nav-item">
            <a class="nav-link" href="/archives/">
              <i class="iconfont icon-archive-fill"></i>
              文章归档</a>
          </li>
        
          
          
          
          <li class="nav-item">
            <a class="nav-link" href="/about/">
              <i class="iconfont icon-user-fill"></i>
              关于</a>
          </li>
        
        
          <li class="nav-item" id="search-btn">
            <a class="nav-link" data-toggle="modal" data-target="#modalSearch">&nbsp;&nbsp;<i
                class="iconfont icon-search"></i>&nbsp;&nbsp;</a>
          </li>
        
      </ul>
    </div>
  </div>
</nav>

    <div class="view intro-2" id="background" parallax=true
         style="background: url('https://frontend-studio-1256354221.file.myqcloud.com/img/banner_2.jpg') no-repeat center center;
           background-size: cover;">
      <div class="full-bg-img">
        <div class="mask flex-center" style="background-color: rgba(0, 0, 0, 0.3)">
          <div class="container text-center white-text fadeInUp">
            <span class="h2" id="subtitle">
              
            </span>

            
              
                <div class="mt-3 post-meta">
                  <i class="iconfont icon-date-fill" aria-hidden="true"></i>
                  <time datetime="2017-04-27 00:00">
                    2017年4月27日 凌晨
                  </time>
                </div>
              

              <div class="mt-1">
                
                  
                  <span class="post-meta mr-2">
                    <i class="iconfont icon-chart"></i>
                    3.4k 字
                  </span>
                

                
                  
                  <span class="post-meta mr-2">
                      <i class="iconfont icon-clock-fill"></i>
                    
                    
                    41
                     分钟
                  </span>
                

                
              </div>
            
          </div>

          
        </div>
      </div>
    </div>
  </header>

  <main>
    
      

<div class="container-fluid">
  <div class="row">
    <div class="d-none d-lg-block col-lg-2"></div>
    <div class="col-lg-8 nopadding-md">
      <div class="container nopadding-md" id="board-ctn">
        <div class="py-5" id="board">
          <div class="post-content mx-auto" id="post">
            
            <article class="markdown-body">
              <meta name="referrer" content="no-referrer" />

<h2 id="GitHub社区"><a href="#GitHub社区" class="headerlink" title="GitHub社区"></a>GitHub社区</h2><p>Git是一个分布式的版本控制系统，最初由Linus Torvalds编写，用作Linux内核代码的管理。在推出后，Git在其它项目中也取得了很大成功，尤其是在Ruby社区中。目前，包括Rubinius、Merb和Bitcoin在内的很多知名项目都使用了Git。Git同样可以被诸如Capistrano和Vlad the Deployer这样的部署工具所使用。</p>
<h3 id="注册Github帐号"><a href="#注册Github帐号" class="headerlink" title="注册Github帐号"></a>注册Github帐号</h3><p><a href="https://github.com/" target="_blank" rel="noopener">官网</a></p>
<h3 id="创建repository"><a href="#创建repository" class="headerlink" title="创建repository"></a>创建repository</h3><p>repository相当于一个仓库，用来放置你的代码文件。首先，登陆进入Github，并进入个人页面，选择New repository(下图红圈的地方)<br><img src="https://upload-images.jianshu.io/upload_images/2031241-8e16d8be5afc1774.jpg" srcset="/img/loading.gif" alt=""><br>创建时，只需要填写Repository name即可。！！！注意，格式为xxx.github.io,xxx为你的名字。（如：zhouxiaoyu1994.github.io)<br><img src="https://upload-images.jianshu.io/upload_images/2031241-5654f6b9a5bfa0e1.jpg" srcset="/img/loading.gif" alt=""></p>
<h2 id="Hexo"><a href="#Hexo" class="headerlink" title="Hexo"></a>Hexo</h2><h3 id="安装前提软件"><a href="#安装前提软件" class="headerlink" title="安装前提软件"></a>安装前提软件</h3><p><a href="https://nodejs.org/en/" target="_blank" rel="noopener">Node.js</a>作用：node.js用来创建hexo博客框架的，我当前安装版本为：node-v4.5.0-x86.msi<a href="https://git-scm.com/" target="_blank" rel="noopener">Git客户端</a>作用：把本地的hexo内容提交到github上去，我当前安装版本为：Git-2.10.0-32-bit.exe</p>
<h3 id="安装Hexo"><a href="#安装Hexo" class="headerlink" title="安装Hexo"></a>安装Hexo</h3><p>所有必备的应用程序安装完成后，即可使用 npm 安装 Hexo。</p>
<div class="hljs"><pre><code class="hljs plain">$ npm install -g hexo-cli
$ npm install hexo --save</code></pre></div>
<h3 id="初始化配置"><a href="#初始化配置" class="headerlink" title="初始化配置"></a>初始化配置</h3><h4 id="创建Hexo文件夹"><a href="#创建Hexo文件夹" class="headerlink" title="创建Hexo文件夹"></a>创建Hexo文件夹</h4><p>安装完成后，根据自己喜好建立目录(如E:\blog\hexo），进该路径下E:\blog\hexo右键Git Bash Here执行以下指令$ hexo init</p>
<h4 id="安装Hexo插件"><a href="#安装Hexo插件" class="headerlink" title="安装Hexo插件"></a>安装Hexo插件</h4><div class="hljs"><pre><code class="hljs plain">npm install hexo-generator-category --save
npm install hexo-generator-tag --save
npm install hexo-server --save
npm install hexo-deployer-git --save
npm install hexo-deployer-heroku --save
npm install hexo-deployer-rsync --save
npm install hexo-deployer-openshift --save
npm install hexo-renderer-marked@0.2 --save
npm install hexo-renderer-stylus@0.2 --save
npm install hexo-generator-feed@1 --save
npm install hexo-generator-sitemap@1 --save</code></pre></div>
<h4 id="本地查看效果"><a href="#本地查看效果" class="headerlink" title="本地查看效果"></a>本地查看效果</h4><p>继续执行以下命令，成功后可登录localhost:4000查看效果</p>
<div class="hljs"><pre><code class="hljs plain">$ hexo server</code></pre></div>
<h3 id="Hexo配置到GitHub"><a href="#Hexo配置到GitHub" class="headerlink" title="Hexo配置到GitHub"></a>Hexo配置到GitHub</h3><h4 id="检查ssh-key"><a href="#检查ssh-key" class="headerlink" title="检查ssh key"></a>检查ssh key</h4><p>首先检查你电脑上现有的 <code>ssh key：$cd~/. ssh</code><br> 检查本机的ssh密钥如果提示：<code>No such file or directory</code><br> 说明你是第一次使用git。生成新的SSH Key：</p>
<div class="hljs"><pre><code class="hljs plain">$ ssh-keygen -t rsa -C &quot;邮件地址@youremail.com&quot;
Generating public&#x2F;p
rivate rsa key pair.
Enter file in which to save the key (&#x2F;Users&#x2F;your_user_directory&#x2F;.ssh&#x2F;id_rsa):&lt;回车就好&gt;</code></pre></div>
<p><strong>注意1:</strong> 此处的邮箱地址，你可以输入自己的邮箱地址；<strong>注意2:</strong> 此处的「-C」的是大写的「C」<br>然后系统会要你输入密码(<strong>一般直接回车就行</strong>)：</p>
<div class="hljs"><pre><code class="hljs plain">Enter passphrase (empty for no passphrase):&lt;输入加密串&gt;
Enter same passphrase again:&lt;再次输入加密串&gt;</code></pre></div>
<p>在回车中会提示你输入一个密码，这个密码会在你提交项目时使用，如果为空的话提交项目时则不用输入。这个设置是防止别人往你的项目里提交内容。有时会出现无法输入密码的情况，遇到的话直接回车就行，不用管。<br><strong>注意：</strong>输入密码的时候没有*字样的，你直接输入就可以了。<br>最后看到这样的界面，就成功设置ssh key了：<br><img src="https://upload-images.jianshu.io/upload_images/2031241-5f529c6db3f5261c.jpg" srcset="/img/loading.gif" alt=""></p>
<h4 id="添加SSH-Key到GitHub"><a href="#添加SSH-Key到GitHub" class="headerlink" title="添加SSH Key到GitHub"></a>添加SSH Key到GitHub</h4><p>在本机设置SSH Key之后，需要添加到GitHub上，以完成SSH链接的设置。<br>打开本地C:\Documents and Settings\Administrator.ssh\id_rsa.pub文件。此文件里面内容为刚才生成的密钥。如果看不到这个文件，你需要设置显示隐藏文件。准确的复制这个文件的内容，才能保证设置的成功。<br>登陆github系统。点击右上角的Settings—&gt;SSH and GPG keys —&gt; add another public keys<br>把你本地生成的密钥复制到里面（key文本框中）标题随便取， 点击 add key 就ok了</p>
<h4 id="测试"><a href="#测试" class="headerlink" title="测试"></a>测试</h4><p>可以输入下面的命令，看看设置是否成功，<a href="mailto:git@github.com">git@github.com</a>的部分不要修改：</p>
<div class="hljs"><pre><code class="hljs plain">$ ssh -T git@github.com</code></pre></div>
<p>如果是下面的反馈：</p>
<div class="hljs"><pre><code class="hljs plain">The authenticity of host &#39;github.com (207.97.227.239)&#39; can&#39;t be established.
RSA key fingerprint is 16:27:ac:a5:76:28:2d:36:63:1b:56:4d:eb:df:a6:48.Are you sure you want to continue connecting (yes&#x2F;no)?
输入yes，然后回车：
Hi cnfeat! You&#39;ve successfully authenticated, but GitHub does not provide shell access.</code></pre></div>
<h4 id="设置用户信息"><a href="#设置用户信息" class="headerlink" title="设置用户信息"></a>设置用户信息</h4><p>Git会根据用户的名字和邮箱来记录提交。GitHub也是用这些信息来做权限的处理，输入下面的代码进行个人信息的设置，把名称和邮箱替换成你自己的，名字必须是你的真名，而不是GitHub的昵称。</p>
<div class="hljs"><pre><code class="hljs plain">$ git config --global user.name &quot;cnfeat&quot;&#x2F;&#x2F;用户名
$ git config --global user.email &quot;cnfeat@gmail.com&quot;&#x2F;&#x2F;填写自己的邮箱</code></pre></div>
<p>SSH Key配置成功本机已成功连接到github。</p>
<h2 id="Jacman-主题"><a href="#Jacman-主题" class="headerlink" title="Jacman 主题"></a>Jacman 主题</h2><p>以下主要转载wuchong 的Jark’s Blog<a href="http://wuchong.me/blog/2014/11/20/how-to-use-jacman/" target="_blank" rel="noopener">http://wuchong.me/blog/2014/11/20/how-to-use-jacman/</a></p>
<h3 id="安装"><a href="#安装" class="headerlink" title="安装"></a>安装</h3><p>在博客根目录下执行如下命令。</p>
<div class="hljs"><pre><code class="hljs plain">$ git clonehttps:&#x2F;&#x2F;github.com&#x2F;wuchong&#x2F;jacman.git themes&#x2F;jacman</code></pre></div>
<h3 id="启用"><a href="#启用" class="headerlink" title="启用"></a>启用</h3><p>修改博客根目录下的_config.yml配置文件中的theme属性，将其设置为jacman。同时建议设置stylus属性中的compress值为true，会自动压缩 CSS 文件，hexo默认配置中不包含这一项，建议开启。如下。</p>
<div class="hljs"><pre><code class="hljs plain">theme: jacman
stylus:
compress: true</code></pre></div>
<h3 id="更新"><a href="#更新" class="headerlink" title="更新"></a>更新</h3><div class="hljs"><pre><code class="hljs plain">cd themes&#x2F;jacman
git pull origin master</code></pre></div>
<p>最好先备份主题目录下的 _config.yml 文件后再升级。</p>
<h3 id="配置指南"><a href="#配置指南" class="headerlink" title="配置指南"></a>配置指南</h3><p>配置文件_config.yml位于jacman主题根目录下。</p>
<div class="hljs"><pre><code class="hljs `">菜单
menu:
主页: &#x2F;
归档: &#x2F;archives
关于: &#x2F;about

控件
widgets:
- category ## 分类
- tag ## 标签
- links ## 友情链接
- rss		 ## rss订阅

RSS
rss: &#x2F;atom.xml 

图片相关
imglogo:
enable:true ## 是否显示网站 logo
src: img&#x2F;logo.png        
favicon: img&#x2F;favicon.ico     ## 网站图标    
apple_icon: img&#x2F;jacman.jpg   ## 苹果设备上的图标，背景不要透明
author_img: img&#x2F;author.jpg   ## 网站底部的博主头像
banner_img: img&#x2F;banner.jpg   ## 博客顶部的图片

主题颜色
theme_color:
theme:&#39;#2ca6cb&#39;		##默认主题颜色为蓝色
close_aside:false	##是否在文章页面自动关闭侧边栏

首页相关
index:
expand:true			## 首页文章是否展开。默认为展开式，显示 Read More。
excerpt_link: Read More    

作者信息
author:
intro_line1:&quot;Hello ,I&#39;m Larry Page in Google.&quot; 	## 网站底部的个人介绍
intro_line2:&quot;This is my blog,believe it or not.&quot;
weibo_verifier:										## 微博秀的验证码
tsina:												## 用于微博秀和微博分享
weibo:												## 用于显示网站底部社交按钮，下同
douban:
zhihu:
email:
twitter:
github:
facebook:
linkedin:
google_plus:
stackoverflow:

目录
toc:
article:true 	## 是否在文章中显示目录
aside:true 		## 是否在侧边栏显示目录

友情链接
links:
码农圈: https:&#x2F;&#x2F;coderq.com,一个面向程序员交流分享的新一代社区
Jark&#39;s Blog: http:&#x2F;&#x2F;wuchong.me

评论
duoshuo_shortname: 
disqus_shortname:  

分享按钮
jiathis:
enable: false   ## 默认使用主题内建分享
id:    
tsina: 

网站统计
google_analytics:
enable: false
id:            ## google analytics ID.
site:          ## 网站地址.

baidu_tongji:
enable: false
sitecode:      ## 百度统计站点特征码

cnzz_tongji:
enable: false
siteid:        ## CNZZ统计站点ID

杂项
ShowCustomFont: true  
fancybox: true        
totop: true           

自定义搜索
google_cse: 
enable: false
cx:  
baidu_search:    
enable: false
id:   
site: http:&#x2F;&#x2F;zhannei.baidu.com&#x2F;cse&#x2F;search 
tinysou_search:     ## http:&#x2F;&#x2F;tinysou.com&#x2F;
enable: false
id: &quot;4ac092ad8d749fdc6293&quot;</code></pre></div>
<h4 id="属性功能"><a href="#属性功能" class="headerlink" title="属性功能"></a>属性功能</h4><p>菜单 menu 默认没有启用/tags和 /categories页面，如果需要启用请在博客目录下的source文件夹中分别建立tags和 categories文件夹每个文件夹中分别包含一个index.md文件。内容为：</p>
<div class="hljs"><pre><code class="hljs plain">layout: tags (或categories)
title: tags (或categories)
---</code></pre></div>
<p>因为主题中已经内置了这两个页面的模板，所以他们会被正确的解析出来。<br><strong>微博秀</strong>：需要注意的是，如果要启用微博秀，您必须填上author属性下tsina和weibo_verifier的值，前者是您微博ID，后者是您微博秀的验证码，访问 <a href="http://app.weibo.com/tool/weiboshow" target="_blank" rel="noopener">http://app.weibo.com/tool/weiboshow</a> 在如下图位置，可以获得您的 verifier，如：我的是b3593ceb。<br><img src="https://upload-images.jianshu.io/upload_images/2031241-064f2c3c0d9ace46.jpg?imageMogr2/auto-orient/strip%7CimageView2/2/w/1240" srcset="/img/loading.gif" alt=""><br>​ 如果要关闭侧边栏，将close_aside置为true，就会在博文页面自动关闭侧边栏。<br><strong>首页显示模式 Index</strong><br>目前首页的显示模式支持两种，一种是原先的卡片式（前往 <a href="http://wuchong.me/jacman" target="_blank" rel="noopener">Demo</a> 预览），另一种是类似官方主题的文章展开式（<a href="http://wuchong.me/" target="_blank" rel="noopener">本站</a>即采用的这种）。两者各有优劣，前者首页加载速度更快，后者文章内容更能吸引读者。主题默认采用后一种展开式，如需开启第一种卡片式，请设置index属性下的expand: false。<br>卡片式的文章摘要是截取文章内容的前140个字，也可以自己总结description<br>并将其放在开头的front-matter中。展开式的文章摘要就是使用``截取了。<br><strong>作者信息 author</strong><br>作者信息，建议尽量填写完整。其中tsina<br>是你的新浪微博ID，不同于用户名或微博主页地址。启用这个属性后，其他用户在微博上分享你文章的同时会自动@你。同时它和weibo_verifier一起作用生成微博秀。intro_line1和intro_line2是网站底部的个人介绍。weibo、twitter、facebook等是用来显示网站右下角的社交按钮的，如下图所示。<br><img src="https://upload-images.jianshu.io/upload_images/2031241-9e6d086092023717.jpg?imageMogr2/auto-orient/strip%7CimageView2/2/w/1240" srcset="/img/loading.gif" alt=""><br><strong>目录 toc</strong><br>是否启用在文章中或侧边栏中的目录功能。二者可以都为true<br>或都为false。同时，如果你希望在特定的某一篇文章中关闭目录功能你可以在文章文件开头中的front-matter中加上一行toc: false。如果希望在某一篇文章中关闭目录自动编号功能你可以在文章文件开头的front-matter中加上一行list_number: false。另外 hexo 2.5.2 开始支持中文目录，想获得更好的体验请升级你的 Hexo 版本。<br><strong>评论 comments</strong><br>填写duoshuo_shortname<a href="http://duoshuo.com/" target="_blank" rel="noopener">多说</a>的用户名，启用多说评论系统。在大陆地区更好用的评论系统。<br>填写disqus_shortname<a href="http://disqus.com/" target="_blank" rel="noopener">disqus</a> 的用户名，启用 disqus 评论系统。国际上更广泛使用的评论系统。设置博客根目录下的_config.yml文件中的disqus_shortname同样也能开启该功能。<br><strong>数学公式 mathjax</strong><br>主题支持写 LaTex 数学公式。只需要在文章文件开头的front-matter中，加上一行mathjax: true，即可在文中写 LaTex 公式。<br><strong>图片浏览 fancybox</strong><br>默认关闭，如果你使用 Hexo 经常发表 Gallery 类型的文章，那么请设置为true。<br><strong>自定义字体 ShowCustomFont</strong><br>是否启用自定义字体，默认开启，主要用于显示网站底部的字体。如果你有一定前端基础可以修改 font.styl 替换为你喜欢的字体。<br><strong>主题颜色更改 Theme Color</strong><br>目前官方还未支持十六进制颜色与String值的转换，所以需要手动添加依赖包，该问题估计不久后会解决。</p>
<div class="hljs"><pre><code class="hljs plain">## 在博客的目录下输入下面指令
cd node_modules&#x2F;hexo-renderer-stylus
sudo npm install stylus@0.49.2 #根据系统文件的权限不同，有的不需要加sudo</code></pre></div>
<p>然后更改在主题目录下的_config.yml的 theme_color下 theme值。</p>
<div class="hljs"><pre><code class="hljs plain">### Theme Color
theme_color:
theme: &#39;#2ca6cb&#39; ##the defaut theme color is blue</code></pre></div>
<h3 id="常见问题"><a href="#常见问题" class="headerlink" title="常见问题"></a>常见问题</h3><p><strong>Q：图片默认都是居左的，我怎么设置能让图片居中呢？</strong><br>使用 ``的HTML标签。</p>
<p><strong>Q：如何建立一篇图片类文章（Gallery Post）？</strong><br>使用hexo new photo “your titile”建立图片类文章，或者直接新建一个 Markdown 文件，将其front-matter修改为如下，即可看到主题为图片类文章提供的样式，<a href="http://wuchong.me/jacman/gallery" target="_blank" rel="noopener">Demo</a>。</p>
<div class="hljs"><pre><code class="hljs plain">&gt; ---
&gt; layout: photo
&gt; title: Gallery Post
&gt; photos:
&gt; - http:&#x2F;&#x2F;i.minus.com&#x2F;ibobbTlfxZgITW.jpg
&gt; - http:&#x2F;&#x2F;i.minus.com&#x2F;iedpg90Y0exFS.jpg
&gt; ---
&gt;</code></pre></div>
<p><strong>Q：我在配置文件中给某一项设置了值，但为什么总是看不到效果啊？</strong><br>_config.yml文件中的每个属性值前面必须留一个空格，建议在 Sublime/Notepad++ 中开启显示所有空格模式。另每篇文章的 front-matter也要注意这个问题。</p>
<p><strong>Q：如何建立自我介绍页面（About 页面）？</strong><br>首先在主目录找到_config.yml，找到url添加about_dir: about到这个板块。然后在/source里面建立about文件夹。在about文件夹里建立index.md。编index.md就和发布其他的文章一样，格式都一样。</p>
<p><strong>Q：怎么提意见和建议？</strong><br>主题还在不断完善中，欢迎 <a href="https://github.com/wuchong/jacman/issues" target="_blank" rel="noopener">open issue</a> 来提建议，参与讨论。</p>
<p><strong>Q：楼主我不喜欢你的配色，怎么换主题的颜色呢？</strong><br>包括颜色在内的很多变量都在jacman/source/css/_base/variable.styl<br>文件中，可以修改成你喜欢的。</p>
<p><strong>Q：英语更能突显我的逼格，怎么换成英语？</strong><br>配置你的博客根目录下的_config.yml，去掉language: zh-CN。</p>
<p><strong>Q：为什么我修改了配置文件/发表了博文，解析出来的却是乱码呢？</strong><br>请将你的配置文件/markdown文件保存成 UTF-8 格式。</p>
<p><strong>Q：为什么开启了微博秀后，显示是空白的，没有内容展示？</strong><br>每次修改参数都会这样，需要多刷新几次或者上传到服务器上就好了。</p>
<p><strong>Q：博主 Jacman Demo 站点中文章的 md 源文件在哪能看到呢？</strong><br>我将 Demo 站点所有源文件放在了 Jacman 的 <a href="https://github.com/wuchong/jacman/tree/site" target="_blank" rel="noopener">site</a> 分支下。</p>
<h2 id="相关资源："><a href="#相关资源：" class="headerlink" title="相关资源："></a>相关资源：</h2><p><a href="https://github.com/" target="_blank" rel="noopener">GitHub社区</a><br><a href="https://hexo.io/themes/" target="_blank" rel="noopener">Hexo主题</a><br><a href="https://nodejs.org/en/" target="_blank" rel="noopener">Node.js</a><br><a href="https://git-scm.com/" target="_blank" rel="noopener">Git客户端</a></p>
<h2 id="参考资料："><a href="#参考资料：" class="headerlink" title="参考资料："></a>参考资料：</h2><p><a href="http://www.wuxubj.cn/2016/08/Hexo-nexT-build-personal-blog/" target="_blank" rel="noopener">Hexo+nexT主题搭建个人博客</a><br><a href="http://www.cnblogs.com/zhcncn/p/4097881.html" target="_blank" rel="noopener">金石开-Hexo搭建Github静态博客</a><br><a href="http://wuchong.me/blog/2014/11/20/how-to-use-jacman/" target="_blank" rel="noopener">wuchong-如何使用 Jacman 主题</a><br><a href="http://www.jianshu.com/p/05289a4bc8b2" target="_blank" rel="noopener">CNFeat-如何搭建一个独立博客——简明Github Pages与Hexo教程</a><br><a href="http://www.bkjia.com/webzh/995207.html" target="_blank" rel="noopener">使用GitHub和Hexo搭建免费静态Blog</a><br><a href="http://ibruce.info/2013/11/22/hexo-your-blog/?utm_source=tuicool&utm_medium=referral" target="_blank" rel="noopener">不如-hexo你的博客</a><br><a href="http://qjzhixing.com/2015/08/26/#四、Hexo的基本命令" target="_blank" rel="noopener">起今知行-使用Hexo搭建博客（二），搭建博客的过程</a></p>
<p><strong>感谢以上诸位博主的热心分享o(≧v≦)o~~</strong></p>

            </article>
            <hr>
            <div>
              <div class="post-metas mb-3">
                
                  <div class="post-meta mr-3">
                    <i class="iconfont icon-category"></i>
                    
                      <a class="hover-with-bg" href="/categories/%E5%BC%80%E5%8F%91%E4%B8%8E%E5%A1%AB%E5%9D%91/">开发与填坑</a>
                    
                  </div>
                
                
                  <div class="post-meta">
                    <i class="iconfont icon-tags"></i>
                    
                      <a class="hover-with-bg" href="/tags/Hexo/">Hexo</a>
                    
                      <a class="hover-with-bg" href="/tags/window/">window</a>
                    
                  </div>
                
              </div>
              
                <p class="note note-warning">本博客所有文章除特别声明外，均采用 <a href="https://zh.wikipedia.org/wiki/Wikipedia:CC_BY-SA_3.0%E5%8D%8F%E8%AE%AE%E6%96%87%E6%9C%AC" target="_blank" rel="nofollow noopener noopener">CC BY-SA 3.0协议</a> 。转载请注明出处！</p>
              
              
                <div class="post-prevnext row">
                  <div class="post-prev col-6">
                    
                    
                      <a href="/2017/04/28/2017042801/">
                        <i class="iconfont icon-arrowleft"></i>
                        <span class="hidden-mobile">Hexo深坑之旅（2）- 搭建swiftype站内搜索的几点说明</span>
                        <span class="visible-mobile">上一篇</span>
                      </a>
                    
                  </div>
                  <div class="post-next col-6">
                    
                    
                      <a href="/2016/12/31/2016123101/">
                        <span class="hidden-mobile">《最终幻想觉醒》评测：英雄幻想的延续</span>
                        <span class="visible-mobile">下一篇</span>
                        <i class="iconfont icon-arrowright"></i>
                      </a>
                    
                  </div>
                </div>
              
            </div>

            
              <!-- Comments -->
              <div class="comments" id="comments">
                
                
  <div id="vcomments"></div>
  <script defer src="https://cdn.staticfile.org/valine/1.4.14/Valine.min.js" ></script>

  <script type="text/javascript">
    var oldLoadVa = window.onload;
    window.onload = function () {
      oldLoadVa && oldLoadVa();

      new Valine({
        el: "#vcomments",
        app_id: "Xj9NvwN7LBLvF2dqHLeRY1ix-gzGzoHsz",
        app_key: "kYB3rhk7JSGIP0RNTvgh7HMq",
        placeholder: "说点什么",
        path: window.location.pathname,
        avatar: "retro",
        meta: ["nick","mail","link"],
        pageSize: "10",
        lang: "zh-CN",
        highlight: false,
        recordIP: false,
        serverURLs: "",
      });
    };
  </script>
  <noscript>Please enable JavaScript to view the <a href="https://valine.js.org" target="_blank" rel="nofollow noopener noopener">comments
      powered by Valine.</a></noscript>


              </div>
            
          </div>
        </div>
      </div>
    </div>
    
      <div class="d-none d-lg-block col-lg-2 toc-container" id="toc-ctn">
        <div id="toc">
  <p class="toc-header"><i class="iconfont icon-list"></i>&nbsp;目录</p>
  <div id="tocbot"></div>
</div>

      </div>
    
  </div>
</div>

<!-- Custom -->


    
  </main>

  
    <a id="scroll-top-button" href="#" role="button">
      <i class="iconfont icon-arrowup" aria-hidden="true"></i>
    </a>
  

  
    <div class="modal fade" id="modalSearch" tabindex="-1" role="dialog" aria-labelledby="ModalLabel"
     aria-hidden="true">
  <div class="modal-dialog modal-dialog-scrollable modal-lg" role="document">
    <div class="modal-content">
      <div class="modal-header text-center">
        <h4 class="modal-title w-100 font-weight-bold">搜索</h4>
        <button type="button" id="local-search-close" class="close" data-dismiss="modal" aria-label="Close">
          <span aria-hidden="true">&times;</span>
        </button>
      </div>
      <div class="modal-body mx-3">
        <div class="md-form mb-5">
          <input type="text" id="local-search-input" class="form-control validate">
          <label data-error="x" data-success="v"
                 for="local-search-input">关键词</label>
        </div>
        <div class="list-group" id="local-search-result"></div>
      </div>
    </div>
  </div>
</div>
  

  

  

  <footer class="mt-5">
  <div class="text-center py-3">
    <div>
      <a href="#"><span>前端画室</span></a>
      <i class="iconfont icon-love"></i>
      <a href="https://github.com/xiaohouye1995" target="_blank" rel="nofollow noopener">
        <span>小侯爷</span></a>
    </div>
    

    

    
  </div>
</footer>

<!-- SCRIPTS -->
<script  src="https://cdn.staticfile.org/jquery/3.4.1/jquery.min.js" ></script>
<script  src="https://cdn.staticfile.org/twitter-bootstrap/4.4.1/js/bootstrap.min.js" ></script>
<script  src="/js/main.js" ></script>


  <script  src="/js/lazyload.js" ></script>



  
  <script  src="https://cdn.staticfile.org/tocbot/4.11.1/tocbot.min.js" ></script>
  <script>
    $(document).ready(function () {
      var boardCtn = $('#board-ctn');
      var boardTop = boardCtn.offset().top;

      tocbot.init({
        tocSelector: '#tocbot',
        contentSelector: '.post-content',
        headingSelector: 'h1,h2,h3,h4,h5,h6',
        linkClass: 'tocbot-link',
        activeLinkClass: 'tocbot-active-link',
        listClass: 'tocbot-list',
        isCollapsedClass: 'tocbot-is-collapsed',
        collapsibleClass: 'tocbot-is-collapsible',
        collapseDepth: 0,
        scrollSmooth: true,
        headingsOffset: -boardTop
      });
      if ($('.toc-list-item').length > 0) {
        $('#toc').css('visibility', 'visible');
      }
    });
  </script>





  <script defer src="https://cdn.staticfile.org/clipboard.js/2.0.6/clipboard.min.js" ></script>
  <script  src="/js/clipboard-use.js" ></script>






<!-- Plugins -->



  <script  src="https://cdn.staticfile.org/typed.js/2.0.11/typed.min.js" ></script>
  <script>
    var typed = new Typed('#subtitle', {
      strings: [
        '  ',
        "Hexo深坑之旅（1）- win7系统下安装hexo&nbsp;",
      ],
      cursorChar: "_",
      typeSpeed: 70,
      loop: false,
    });
    typed.stop();
    $(document).ready(function () {
      $(".typed-cursor").addClass("h2");
      typed.start();
    });
  </script>



  <script  src="https://cdn.staticfile.org/anchor-js/4.2.2/anchor.min.js" ></script>
  <script>
    anchors.options = {
      placement: "right",
      visible: "hover",
      
    };
    var el = "h1,h2,h3,h4,h5,h6".split(",");
    var res = [];
    for (item of el) {
      res.push(".markdown-body > " + item)
    }
    anchors.add(res.join(", "))
  </script>



  <script  src="/js/local-search.js" ></script>
  <script>
    var path = "/local-search.xml";
    var inputArea = document.querySelector("#local-search-input");
    inputArea.onclick = function () {
      searchFunc(path, 'local-search-input', 'local-search-result');
      this.onclick = null
    }
  </script>



  <script  src="https://cdn.staticfile.org/fancybox/3.5.7/jquery.fancybox.min.js" ></script>
  <link  rel="stylesheet" href="https://cdn.staticfile.org/fancybox/3.5.7/jquery.fancybox.min.css" />

  <script>
    $('#post img:not(.no-zoom img, img[no-zoom]), img[zoom]').each(
      function () {
        var element = document.createElement('a');
        $(element).attr('data-fancybox', 'images');
        $(element).attr('href', $(this).attr('src'));
        $(this).wrap(element);
      }
    );
  </script>


















  </body>
</html>
